import {
    Routes,
    Route
} from "react-router-dom"; // 引入 react-router-dom
import {Suspense} from 'react' // Suspense 配合前面的 laze() 使用，不加上会报错
const dealRoute = (route) => {
    let arr = []
    route.map(item => {
        if (item.children && item.children.length > 0) {
            arr.push(item, ...item.children)
        } else {
            arr.push(item)
        }
    })
    return arr
}
const RouterView = (props) => {
    let {route} = props // 拿到index.jsx页面传过来的 路由列表
    const res = dealRoute(route)
    return (
        <Suspense fallback={<div>Loading...</div>}>
            <Routes>
                {
                    res.map((item,i) => {
                        return <Route key={i} path={item.key} element={<item.component/>}/>
                    })
                }
            </Routes>
        </Suspense>
    )
}

export default RouterView
